<template>
  <div>
    <Form inline :label-colon="true" class="search-form" :label-width="80">
      <FormItem label="文件名">
        <Input v-model="params.oldFileName" placeholder="请输入文件名" style="width:130px"/>
      </FormItem>
      <FormItem label="上传人">
        <Input v-model="params.createUserName" placeholder="请输入上传人" style="width:130px"/>
      </FormItem>
      <FormItem label="文件类型">
        <Input v-model="params.fileType" placeholder="请输入文件类型" style="width:130px"/>
      </FormItem>
      <FormItem label="上传时间">
        <DatePicker
          type="date"
          v-model="params.uploadDate"
          placeholder="请输入上传时间"
          transfer
          style="width:140px"
          @on-change="handleChange"
          format="yyyy-MM-dd" />
          <Button
          type="primary"
          @click="publicGetData()"
          style="margin-left: 10px"
          v-auth="'列表'"
        >搜索
        </Button>
      </FormItem>
      <FormItem :label-width="0">
        <BaseUpload
          v-auth="'导入'"
          name="file"
          :multiple="true"
          :show-upload-list="false"
          :action="action.uploadFileLog"
          @publicSuccess="publicSuccess"
        />
        <Button
          type="primary"
          v-auth="'导出'"
          @click="handleExport"
          style="margin-left: 10px;">导出</Button>
      </FormItem>
    </Form>
    <Breadcrumb></Breadcrumb>
    <BaseTable
      ref="baseTable"
      :action="action.readFileLog"
      :columns="columns"
    />
  </div>
</template>

<script>
import { tableMixin } from '../../../mixin'
import API_KEY from '../../../api'
import columns from './filelog-columns'
import { exportSyslogFileLog } from '../../../api/modules/system-log/fileLog'
import message from '../../../utils/message'
import BaseUtil from '../../../utils/BaseUtil'

export default {
  name: 'FileLog',
  mixins: [tableMixin],
  data () {
    return {
      params: {
        oldFileName: '',
        createUserName: '',
        uploadDate: '',
        fileType: ''
      },
      columns,
      action: {
        // 根据分页参数获取表格数据接口（查询表格数据只需要readMenuByPage参数和columns参数）
        readFileLog: API_KEY.log.readFileLog,
        uploadFileLog: API_KEY.log.uploadFileLog
      }
    }
  },
  methods: {
    /**
     * 导出
     */
    handleExport () {
      exportSyslogFileLog(this.params).then(res => {
        message.message.success(res.message)
        const fileName = res.data.substring(res.data.lastIndexOf('/') + 1)
        BaseUtil.downFile(res.data, fileName)
      })
    },
    /**
     * 导入成功触发
     */
    publicSuccess (param) {
      this.publicGetData()
    },
    /**
     * 时间切换时触发
     */
    handleChange (val) {
      this.params.uploadDate = val
    }
  },
  components: {
    BaseUpload: () => import('@/components/view-ui/BaseUpload')
  }
}
</script>

<style scoped>

</style>
